<!DOCTYPE html>
<#assign ctx=request.contextPath>
<html>
	<head>
    	<title>商品管理-添加商品</title>
    	<meta charset="UTF-8">
     	<link rel="stylesheet" type="text/css" href="${ctx}/css/bootstrap.css" />
	    <link rel="stylesheet" type="text/css" href="${ctx}/css/bootstrap-responsive.css" />
	    <link rel="stylesheet" type="text/css" href="${ctx}/css/style.css" />
	    <link rel="stylesheet" type="text/css" href="${ctx}/css/admin-right.css" />
	    <script type="text/javascript" src="${ctx}/js/jquery-1.11.0.js"></script>
		<script type="text/javascript" src="${ctx}/js/jquery-migrate-1.2.1.js"></script>
		<script type="text/javascript" src="${ctx}/js/My97DatePicker/WdatePicker.js"></script>
		<!-- ajax文件上传需要 -->
		<script type="text/javascript" src="${ctx}/js/jquery.form.js"></script>
		<!-- 导入tinymce 编辑器 -->
		<script type="text/javascript" src="${ctx}/js/tiny_mce/tiny_mce.js"></script>

    	<script type="text/javascript">
    	 tinyMCE.init({
			mode : "exact", // mode:指定附加的模式 textareas : html页面上所有的textarea元素都附加上.
			elements : "descTextArea", // exact:精确的模式， 需要指定html元素id属性值
			theme : "advanced", // 主题：advanced(高级的) 、simple(简单的)
			language : "zh-cn", // 国际化
			/** 指定工具按钮资源文件存放的文件夹 */
			plugins : "autolink,lists,pagebreak,style,layer,table,save,advhr,advimage,advlink,emotions,iespell,inlinepopups,insertdatetime,preview,media,searchreplace,print,contextmenu,paste,directionality,fullscreen,noneditable,visualchars,nonbreaking,xhtmlxtras,template,wordcount,advlist,autosave",
			/** 指定工具按钮在上面放四排 */
			theme_advanced_buttons1 : "save,newdocument,|,bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,styleselect,formatselect,fontselect,fontsizeselect",
			theme_advanced_buttons2 : "cut,copy,paste,pastetext,pasteword,|,search,replace,|,bullist,numlist,|,outdent,indent,blockquote,|,undo,redo,|,link,unlink,anchor,image,cleanup,help,code,|,insertdate,inserttime,preview,|,forecolor,backcolor",
			theme_advanced_buttons3 : "tablecontrols,|,hr,removeformat,visualaid,|,sub,sup,|,charmap,emotions,iespell,media,advhr,|,print,|,ltr,rtl,|,fullscreen",
			theme_advanced_buttons4 : "insertlayer,moveforward,movebackward,absolute,|,styleprops,|,cite,abbr,acronym,del,ins,attribs,|,visualchars,nonbreaking,template,pagebreak,restoredraft",
			
			/** 指定工具按钮上下的位置 top、bottom */
			theme_advanced_toolbar_location : "top",
			/** 指定工具按钮左、中、右显示的位置 left、center、right */
			theme_advanced_toolbar_align : "left",
			/** 指定状态栏的位置 (top、bottom) */
			theme_advanced_statusbar_location : "bottom",
			/** 指定编辑器是否可以拖动 */
			theme_advanced_resizing : true
		    });
    	 
    	 	$(function(){
    	 	
    	 	    //商品类型数据ajax加载
    	 		var url = "${ctx}/admin/goodsType/maxTypeAjax";
    	 	    $.getJSON(url,function(list){
    	 	    	$.each(list,function(i,goodsType){
    	 	    		$("<option/>").val(goodsType.CODE).text(goodsType.NAME).appendTo("#goodsType");
    	 	    	});
    	 	    });
    	 	    
    	 	    //商品类型下拉列表联动操作
    	 	   $("#goodsType").change(function(){
    	 		  //清空下拉列表项
    	 		  $("#goodsMinType > option").remove();
    	 		  var url2 = "${ctx}/admin/goodsType/minTypeAjax?code="+this.value; 
    	 		  $.getJSON(url2,function(list){
      	 	    	$.each(list,function(i,goodsType){
      	 	    		$("<option/>").val(goodsType.CODE).text(goodsType.NAME).appendTo("#goodsMinType");
      	 	    	});
      	 	      });
    	 	    });
    	 	
    	 	
    	 	
    	 		$("#picForm").ajaxForm({
    	 			url:"${ctx}/admin/goods/imgUpload",
    	 			type:"POST",
    	 			dataType:"text",
    	 			async:true,
    	 			success:function(imgUrl){
    	 				tinyMCE.execCommand("mceInsertContent",false,"<img src=${ctx}"+imgUrl+">");
    	 			},
    	 			error:function(){
    	 				alert("文件上传失败!");	
    	 			}
    	 		});
    	 		
		    	/** 为添加商品表单绑定提交事件 */
		    	$("#addGoodsForm").submit(function(){
		    		/** 表单输入校验 */
		    		var title = $("#title");
		    		var brandName = $("#brandName");
		    		var price = $("#price");
		    		var favorablePrice = $("#favorablePrice");
		    		var groundingDate = $("#groundingDate");
		    		var storage = $("#storage");
		    		var pic = $("#pic");
		    		var desc = tinyMCE.get('descTextArea').getContent();
		    		var msg = "";
		    		
		    		// 判断表单元素
		    		if ($.trim(title.val()) == ""){
		    			msg = "商品标题不能为空！";
		    			title.focus();
		    		}else if ($.trim(brandName.val()) == ""){
		    			msg = "品牌名称不能为空！";
		    			brandName.focus();
		    		}else if ($.trim(price.val()) == ""){
		    			msg = "价格不能为空！";
		    			price.focus();
		    		}else if (isNaN($.trim(price.val()))){
		    			msg = "价格格式不正确！";
		    			price.focus();
		    		}else if ($.trim(favorablePrice.val()) == ""){
		    			msg = "优惠价格不能为空！";
		    			favorablePrice.focus();
		    		}else if (isNaN($.trim(favorablePrice.val()))){
		    			msg = "优惠价格格式不正确！";
		    			favorablePrice.focus();
		    		}else if ($.trim(groundingDate.val()) == ""){
		    			msg = "上架日期不能为空！";
		    			groundingDate.focus();
		    		}else if ($.trim(storage.val()) == ""){
		    			msg = "库存不能为空！";
		    			storage.focus();
		    		}else if (isNaN($.trim(storage.val()))){
		    			msg = "库存格式不正确！";
		    			storage.focus();
		    		}else if ($.trim(pic.val()) == ""){
		    			msg = "请选择要上传的商品封面！";
		    		}else if ($.trim(desc) == ""){
		    			msg = "商品描述不能为空！";
		    		}
		    		
		    		if (msg != ""){
		    			alert(msg);
		    			return false;
		    		}else{
		    			return true;
		    		}
		    	});
		    	
		    	/** 为返回按钮绑定点击事件 */
				$('#backid').click(function(){
					window.location.href = "${ctx}/admin/goods/goodsList";
				});
    	 	});
		</script>
	</head>
	<body>
		
		<table class="table table-bordered table-hover definewidth m10">
		    <form id="addGoodsForm" action="${ctx}/admin/goods/addGoods" method="POST" class="definewidth m20" enctype="multipart/form-data">
		        <tr>
		        	<td width="10%" class="tableleft">商品类型</td>
		            <td>
		            	<select id="goodsType">
		            	<option>请选择商品类型</option>
		            	</select>
		            </td>
		            <td width="10%" class="tableleft">商品标题</td>
		            <td><input type="text" name="title" id="title"/></td>
		        </tr>
		        <tr>
		        	<td width="10%" class="tableleft">品牌名称</td>
		            <td><input type="text" name="brandName" id="brandName"/></td>
		            
		            <td width="10%" class="tableleft">商品价格</td>
		            <td><input type="text" name="price" id="price"/></td>
		        </tr>
		        <tr>
		        	<td width="10%" class="tableleft">优惠价格</td>
		            <td><input type="text" name="favorablePrice" id="favorablePrice"/></td>
		            
		            <td width="10%" class="tableleft">上架日期</td>
		             <td><input type="text" class="Wdate" name="groundingDate" id="groundingDate" onfocus="WdatePicker({lang:'zh-cn',dateFmt:'yyyy-MM-dd'});"/></td>
		        </tr>
		        <tr>
		            <td width="10%" class="tableleft">商品库存</td>
		            <td><input type="text" name="storage" id="storage"/></td>
		            
		            <td width="10%" class="tableleft">商品封面</td>
		            <td><input type="file" name="pic" id="pic"/></td>
		        </tr>
		        <tr>
		        	<td width="10%" class="tableleft">商品尺寸</td>
		            <td>
		            	<select id="goodsMinType" name="goodsType.code">
		            	 <!--  <option>请选择商品类型</option>-->
		            	</select>
		            </td>
		        </tr>
		        <tr>
		            <td width="10%" class="tableleft">商品描述</td>
		            <td colspan="3">
		            	<textarea name="description" id="descTextArea" rows="12" cols="200" cssStyle="width:100%;"></textarea>
		            </td>
		        </tr>
		        
		    </form>
	        <tr>
	            <td class="tableleft"></td>
	            <td>
	            	<form id="picForm" method="POST" enctype="multipart/form-data">
	            		<input type="file" name="pic"/>
	            	</form>
	            	<button type="submit" class="btn btn-primary" form="picForm">上传</button>
	            	&nbsp;&nbsp;<button type="submit" class="btn btn-primary" form="addGoodsForm">保存</button>
	                &nbsp;&nbsp;<button type="button" class="btn btn-success" name="backid" id="backid">返回</button>
	            </td>
	        </tr>
		</table>
		
	</body>
</html>